<template>
  <div class="addMeteForm">
    <a-modal
      :visible="visible"
      title="添加伴侣"
      @ok="addMetaFormSubmit"
      @cancel="cancelClose"
      cancelText="取消"
      okText="确定"
    >
      <a-form
        layout="vertical"
        :model="addMemberForm"
        :rules="addMemberFormRules"
      >
        <a-form-item label="伴侣" name="father_id">
          <a-select
            v-model:value="addMemberForm.mate_id"
            placeholder="请选择伴侣"
          >
            <a-select-option
              v-if="userinfo.gender == 0"
              v-for="item in manList"
              :key="item.id"
              :value="item.id.toString()"
              >{{ item.nickname }}</a-select-option
            >
            <a-select-option
              v-else
              v-for="item in womenList"
              :key="item.id"
              :value="item.id.toString()"
              >{{ item.nickname }}</a-select-option
            >
          </a-select>
        </a-form-item>
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import { getMateList, setMate } from "@/request/api";
import { Form, message } from "ant-design-vue";
export default {
  name: "AddMateForm",
  props: {
    visible: Boolean,
    userinfo: Object,
  },
  data() {
    return {
      manList: [],
      womenList: [],
      addMemberForm: {
        mate_id: "",
      },
      addMemberFormRules: {
        mate_id: [{ required: true, message: "请选择伴侣", trigger: "blur" }],
      },
    };
  },
  methods: {
    addMetaFormSubmit() {
      const useForm = Form.useForm;
      let that = this;
      const { validate } = useForm(this.addMemberForm, this.addMemberFormRules);
      validate()
        .then(() => {
          let param = that.addMemberForm;
          param.user_id = "" + that.userinfo.id;
          setMate(param).then((res) => {
            if (res.code == 0) {
              message.success("修改成功");
              that.addMemberForm = {
                mate_id: "",
              };
              that.$emit("change", false);
            }
          });
        })
        .catch((err) => {
          message.error(err.errorFields[0].errors);
        });
    },
    cancelClose() {
      this.$emit("change", false);
    },
  },
  created() {
    let that = this;
    getMateList().then((res) => {
      if (res.code == 0) {
        that.manList = res.data.man;
        that.womenList = res.data.women;
      }
    });
  },
};
</script>

<style scoped></style>
